<template>
	<view class="">
		<uni-card :title="`套餐详情`">
			<view class="" style="line-height: 40rpx;">
				<view class="">
					类型模型：{{detail?.modeName}}
				</view>
				<view class="">
					对话次数：{{detail?.tokenCount}}
				</view>
				<view class="">
					价格 ：{{detail?.price}}
				</view>
			</view>
		</uni-card>
		<uni-card>
			<view class="">
				<view class="_items">
					<span>数量：</span><uni-number-box :min="1" v-model="vModelValue" @change="changeValue" />
				</view>
				
				<view class="_items_other">
					<span>总价 ：</span> <span class="money">{{detail?.price  * vModelValue}}</span>
				</view>
			</view>
		</uni-card>
	</view>
	<button class="zhi_button" @click="payMent">立即支付</button>
</template>

<script setup>
	import {ref } from 'vue';
	import { addOrder ,createOrder} from "../../api"
	import { onLoad } from '@dcloudio/uni-app';
	import { uniCommon, uniRouter, uniToast } from '../../utils';
	let vModelValue = ref(1);
	let detail = ref();
	onLoad((options)=>{
		console.log(options)
		if(options.obj){
		  detail.value = uniCommon.jsonToObject(options.obj)	
		}
		console.log(detail.value)
	})
	function changeValue(d){
		console.log(d)
	}
	
	async function payMent(){
		console.log("payment")
		try{
			let param = {
				comboId: detail.value.modeId,
				count:vModelValue.value,
				price:detail.value.price,
				totalPrice:vModelValue.value * detail.value.price
			}
			console.log(param)
			let tempOrder = await createOrder(param)
			console.log(tempOrder)
			uni.requestPayment({
				      timeStamp: tempOrder.data.timeStamp,
				      nonceStr: tempOrder.data.nonceStr,
				      package: tempOrder.data.packageValue,
				      signType: tempOrder.data.signType,
				      paySign: tempOrder.data.paySign,
				      success(res) {
				        // 支付成功
						console.log(res)
						if(res.errMsg == 'requestPayment:ok'){
							uniToast.toast("支付成功")
							
							uniRouter.redirectTo('/pages/minePackage/minePackage')
						}
						
				      },
				      fail() {
				        // 支付失败
						uniToast.toast("支付失败")
				      }
			})
		}catch(err){
			uniToast.toast("支付失败")
		}
		
		
	}
</script>

<style lang="scss">
	::v-deep .uni-card{
		background: #dbe1f9 !important;
	}
	._items{
		display: flex;
		align-items: center;
		justify-content: space-between;
		font-weight: 500;
		font-size: 30rpx;
	}
	._items_other{
		display: flex;
		align-items: center;
		justify-content: space-between;
		line-height: 80rpx;
		margin-top:30rpx;
	}
	.money{
		font-size: 45rpx;
		color:#333333;
	}
	.zhi_button{
		background: #f25;
		width:690rpx;
		position: absolute;
		bottom:200rpx;
		left:50%;
		transform: translate(-50%,0);
		color:#fff;
	}
</style>